import 'package:flutter/material.dart';
import 'package:flutter_kit_dsp/flutter_kit_dsp.dart';

import '../../commont/button.dart';
import '../../tool/assets.dart';
import 'sound_item.dart';

class MyDelay extends DelayPageDelegate {
  ///第二排，汽车图像，+ 两边🔊 + 底部🔊
  Widget _item2(int flex, BuildContext context) {
    ///左右两边的🔊
    Widget _item_sound(int flex, int i) {
      return Expanded(
        flex: flex,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Flexible(flex: 3, child: Container()),
            SoundItem(ch: globalController.rxModel.value.ch_list[i]),
            Flexible(flex: 1, child: Container()),
            SoundItem(ch: globalController.rxModel.value.ch_list[i + 2]),
            Flexible(flex: 2, child: Container()),
          ],
        ),
      );
    }

    return Flexible(
      flex: flex,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          ///左边🔊
          _item_sound(1, 0),

          ///中间车子图片
          Flexible(flex: 2, child: Image.asset(assets.car)),

          ///右边🔊
          _item_sound(1, 1),
        ],
      ),
    );
  }

  @override
  Widget buildBody(BuildContext context, Widget child) {
    return Obx(() {
      return Container(
        ///这里要设置下颜色，否则Container不会创建，上面点击空白隐藏键盘，会有的地方不生效
        color: Colors.transparent,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          spacing: 10,
          children: [
            const Text(
              "TIME ALIGNMENT SETUP",
              style: TextStyle(
                fontSize: 20,
                fontWeight: FontWeight.bold,
                color: Colors.white,
              ),
            ),
            _item2(12, context),

            ///第三排，汽车下面的🔊
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Expanded(flex: 4, child: Container()),
                Expanded(
                    flex: 3,
                    child: SoundItem(
                        ch: globalController.rxModel.value.ch_list[globalController.rxModel.value.ch_list.length - 2])),
                Expanded(flex: 1, child: Container()),
                Expanded(
                    flex: 3,
                    child: SoundItem(
                        ch: globalController.rxModel.value.ch_list[globalController.rxModel.value.ch_list.length - 1])),
                Expanded(flex: 4, child: Container()),
              ],
            ),
            Flexible(flex: 2, child: Container()),

            ///第4排，delay按钮
            Flexible(
              flex: 1,
              child: Container(
                padding: const EdgeInsets.only(left: 30, right: 30),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: globalController.rxModel.value.delay_list
                      .map(($0) => kMyTextButton(
                          name: $0,
                          select: globalController.rxModel.value.teyp_string == $0,
                          onClick: (p0) => globalController.updateDelayType($0)))
                      .toList(),
                ),
              ),
            ),
          ],
        ),
      );
    });
  }
}
